@font-face {
	font-family: Dense;
	src: url('../fonts/Dense-Regular.otf');
}

* {
	margin: 0px;
	padding: 0px;
}

body {
	overflow: hidden;
	background: #f3c5bd;
	background: -moz-linear-gradient(top,  #f3c5bd 0%, #e86c57 0%, #ea2803 0%, #ff6600 79%, #c72200 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f3c5bd), color-stop(0%,#e86c57), color-stop(0%,#ea2803), color-stop(79%,#ff6600), color-stop(100%,#c72200));
	background: -webkit-linear-gradient(top,  #f3c5bd 0%,#e86c57 0%,#ea2803 0%,#ff6600 79%,#c72200 100%);
	background: -o-linear-gradient(top,  #f3c5bd 0%,#e86c57 0%,#ea2803 0%,#ff6600 79%,#c72200 100%);
	background: -ms-linear-gradient(top,  #f3c5bd 0%,#e86c57 0%,#ea2803 0%,#ff6600 79%,#c72200 100%);
	background: linear-gradient(to bottom,  #f3c5bd 0%,#e86c57 0%,#ea2803 0%,#ff6600 79%,#c72200 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3c5bd', endColorstr='#c72200',GradientType=0 );
}
.antartica {
	overflow: hidden;
	background: rgb(42,176,237);
	background: -moz-linear-gradient(top,  rgba(42,176,237,1) 13%, rgba(42,176,237,1) 21%, rgba(159,216,239,1) 70%, rgba(159,216,239,1) 72%, rgba(159,216,239,1) 72%, rgba(159,216,239,1) 72%, rgba(159,216,239,1) 76%, rgba(159,216,239,1) 77%, rgba(159,216,239,1) 77%, rgba(159,216,239,1) 80%, rgba(159,216,239,1) 82%, rgba(159,216,239,1) 82%, rgba(159,216,239,1) 83%, rgba(159,216,239,1) 88%, rgba(191,232,249,1) 92%, rgba(228,245,252,1) 98%, rgba(228,245,252,1) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(13%,rgba(42,176,237,1)), color-stop(21%,rgba(42,176,237,1)), color-stop(70%,rgba(159,216,239,1)), color-stop(72%,rgba(159,216,239,1)), color-stop(72%,rgba(159,216,239,1)), color-stop(72%,rgba(159,216,239,1)), color-stop(76%,rgba(159,216,239,1)), color-stop(77%,rgba(159,216,239,1)), color-stop(77%,rgba(159,216,239,1)), color-stop(80%,rgba(159,216,239,1)), color-stop(82%,rgba(159,216,239,1)), color-stop(82%,rgba(159,216,239,1)), color-stop(83%,rgba(159,216,239,1)), color-stop(88%,rgba(159,216,239,1)), color-stop(92%,rgba(191,232,249,1)), color-stop(98%,rgba(228,245,252,1)), color-stop(100%,rgba(228,245,252,1)));
	background: -webkit-linear-gradient(top,  rgba(42,176,237,1) 13%,rgba(42,176,237,1) 21%,rgba(159,216,239,1) 70%,rgba(159,216,239,1) 72%,rgba(159,216,239,1) 72%,rgba(159,216,239,1) 72%,rgba(159,216,239,1) 76%,rgba(159,216,239,1) 77%,rgba(159,216,239,1) 77%,rgba(159,216,239,1) 80%,rgba(159,216,239,1) 82%,rgba(159,216,239,1) 82%,rgba(159,216,239,1) 83%,rgba(159,216,239,1) 88%,rgba(191,232,249,1) 92%,rgba(228,245,252,1) 98%,rgba(228,245,252,1) 100%);
	background: -o-linear-gradient(top,  rgba(42,176,237,1) 13%,rgba(42,176,237,1) 21%,rgba(159,216,239,1) 70%,rgba(159,216,239,1) 72%,rgba(159,216,239,1) 72%,rgba(159,216,239,1) 72%,rgba(159,216,239,1) 76%,rgba(159,216,239,1) 77%,rgba(159,216,239,1) 77%,rgba(159,216,239,1) 80%,rgba(159,216,239,1) 82%,rgba(159,216,239,1) 82%,rgba(159,216,239,1) 83%,rgba(159,216,239,1) 88%,rgba(191,232,249,1) 92%,rgba(228,245,252,1) 98%,rgba(228,245,252,1) 100%);
	background: -ms-linear-gradient(top,  rgba(42,176,237,1) 13%,rgba(42,176,237,1) 21%,rgba(159,216,239,1) 70%,rgba(159,216,239,1) 72%,rgba(159,216,239,1) 72%,rgba(159,216,239,1) 72%,rgba(159,216,239,1) 76%,rgba(159,216,239,1) 77%,rgba(159,216,239,1) 77%,rgba(159,216,239,1) 80%,rgba(159,216,239,1) 82%,rgba(159,216,239,1) 82%,rgba(159,216,239,1) 83%,rgba(159,216,239,1) 88%,rgba(191,232,249,1) 92%,rgba(228,245,252,1) 98%,rgba(228,245,252,1) 100%);
	background: linear-gradient(to bottom,  rgba(42,176,237,1) 13%,rgba(42,176,237,1) 21%,rgba(159,216,239,1) 70%,rgba(159,216,239,1) 72%,rgba(159,216,239,1) 72%,rgba(159,216,239,1) 72%,rgba(159,216,239,1) 76%,rgba(159,216,239,1) 77%,rgba(159,216,239,1) 77%,rgba(159,216,239,1) 80%,rgba(159,216,239,1) 82%,rgba(159,216,239,1) 82%,rgba(159,216,239,1) 83%,rgba(159,216,239,1) 88%,rgba(191,232,249,1) 92%,rgba(228,245,252,1) 98%,rgba(228,245,252,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2ab0ed', endColorstr='#e4f5fc',GradientType=0 );
}
p.nombre, p.subnombre {
	font-family: 'Dense';
}

p.nombre {
	font-size: 4.5em;
}

p.subnombre {
	font-size: 2.5em;
}

#parrafo {
	border: solid 0px #000000 margin : 0;
	width: 100%;
	height: 100%;
	position: fixed;
}

#monkey {
	margin-left: -50%;
	position: absolute;
	top: calc(75% - 172px);
}

#grass {
	position: absolute;
	top: calc(75% - 120px);
}

#tree {
	position: absolute;
	margin-left: 200%;
	top: calc(75% - 525px);
}
#paginaUno {
	width: 100%;
	height: 100%;
}

#paginaDos {

	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 100%;
	background: #D8D8D8;
}

#superior {
	width: 100%;
	height: 85%;
}

#footer {
	width: 100%;
	height: 25%;
	background-color: black;
	font-family: 'Calibri';
	color: #BDBDBD;
	position: absolute;
	bottom: 0;
}

#footer_left {
	float: left;
	margin: 15px 0px 10px 5%;
	width: 40%;
	display: inline-table;
	text-align: justify;
}

#footer_right {

	float: right;
	width: 40%;
	display: inline-table;
	text-align: justify;
	margin: 15px 5% 10px 5%;
}

#buttons {
	font-family: 'Batch';
	width: 100%;
	top: 90%;
	position: absolute;
	text-align: center;
}

#gray_mountain, #pink_mountain, #sky_mountain {
	/*display: none;*/
	position: absolute;
	/*top: calc(75% - 290px);*/

	/*top: 1000px;*/
}
#pink_mountain {
	margin-left: +120px;
}

#carga {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #D8D8D8;
}

#carga2 {
	position: absolute;
	top: 80%;
	left: 50%;
	width: 500px;
	height: 500px;
	margin-top: -250px;
	margin-left: -250px;
}

#circle1, #circle2 {
	margin-left: 49%;
	position: absolute;
	width: 13px;
	height: 13px;
	border-radius: 50%;
	background: #4679BD;
	border-style: solid;
	border-color: #000000;
	border: black 1px solid;
}
#circle2 {
	margin-left: 51%;
}

#circle3 {
	margin-left: calc(100% - 100px);
	top: calc(100% - 5px);
	position: absolute;
	width: 250px;
	height: 120px;
	border-radius: 10px 10px 0 0;
	background: #4679BD;
	text-align: left;
}
.flecha2 {
	margin-left: calc(100% - 150px) !important;
}

#flecha {
	margin-left: 5px;
	font-family: 'Calibri';
}
.sun1, .sun2 {
	position: absolute;
	width: 250px;
	height: 250px;
	border-radius: 50%;
}

.sun1 {
	margin-left: 85%;
	margin-top: 5%;
	background: #FDB813;
}
.sun2 {
	margin-left: 60% !important;
	margin-top: 25%;
	background: #F3F781;
}
.montanaAbajo {
	top: calc(1000% + 290px);
}
.montanaArriba {
	top: calc(75% - 290px) !important;
}
